﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8" name="viewport" content="width=device-width" />
    <title>客户管理</title>
    <link href="../css/bootstrap.min.css" rel="stylesheet" />
    <script src="../Content/scripts/jquery-1.11.1.min.js"></script>
    <link href="../Content/styles/font-awesome.min.css" rel="stylesheet" />
    <link href="../Content/scripts/plugins/jquery-ui/jquery-ui.min.css" rel="stylesheet" />
    <script src="../Content/scripts/plugins/jquery-ui/jquery-ui.min.js"></script>
    <link href="../Content/scripts/bootstrap/bootstrap.min.css" rel="stylesheet" />
    <script src="../Content/scripts/bootstrap/bootstrap.min.js"></script>
    <link href="../Content/scripts/plugins/jqgrid/jqgrid.css" rel="stylesheet" />
    <link href="../Content/styles/learun-ui.css" rel="stylesheet" />
    <script src="../Content/scripts/plugins/jqgrid/grid.locale-cn.js"></script>
    <script src="../Content/scripts/plugins/jqgrid/jqgrid.min.js"></script>
    <script src="../Content/scripts/plugins/tree/tree.js"></script>
    <script src="../Content/scripts/plugins/validator/validator.js"></script>
    <script src="../Content/scripts/utils/learun-ui.js"></script>
    <script src="../Content/scripts/utils/learun-form.js"></script>
    <script src="CustomerJS.js"></script>

    <style type="text/css">
        body {
            margin: 10px;
            margin-bottom: 0px;
        }
    </style>
</head>
<body>
    <div class="titlePanel">
        <div class="title-search">
            <table>
                <tr>
                    <td style="padding-left: 5px;">
                        <input id="txt_Keyword" type="text" class="form-control" placeholder="请输入要查询关键字" style="width: 200px;" />
                    </td>
                    <td style="padding-left: 5px;">
                        <a id="btn_Search" class="btn btn-primary"><i class="fa fa-search"></i>&nbsp;查询</a>
                    </td>
                </tr>
            </table>
        </div>
        <div class="toolbar">
            <div class="btn-group">
                <a id="lr-add" class="btn btn-default" onclick="btn_add()"><i class="fa fa-plus"></i>&nbsp;新增</a>
                <a id="lr-edit" class="btn btn-default" onclick="btn_edit(event)"><i class="fa fa-pencil-square-o"></i>&nbsp;编辑</a>
                <a id="lr-use" class="btn btn-default" onclick="btn_use(event)"><i class="fa fa-eye"></i>&nbsp;投入使用</a>
                <a id="lr-delete" class="btn btn-default" onclick="btn_delete(event)"><i class="fa fa-trash-o"></i>&nbsp;删除</a>
                <a id="lr-search" class="btn btn-default" onclick="btn_search(event)"><i class="fa fa-eye"></i>&nbsp;所购设备</a>
            </div>
        </div>
    </div>
    <div class="gridPanel">
        <table id="gridTable"></table>
        <div id="gridPager"></div>
    </div>

    <script type="text/javascript">

        $(window).resize(function (e) {
            window.setTimeout(function () {
                $('#gridTable').setGridWidth(($('.gridPanel').width()));
                $("#gridTable").setGridHeight($(window).height() - 136.5);
            }, 200);
            e.stopPropagation();
        });

        //加载表格
        var selectedRowIndex = 0;
        var $gridTable = $('#gridTable');
        $gridTable.jqGrid({
            url: "./CustomerHandler.ashx",
            postData: {
                Action: "GetCustomerInfo",
                keyword: $("#txt_Keyword").val()
            },
            datatype: "json",
            height: $(window).height() - 136.5,
            //loadonce: true,
            autowidth: true,
            //jsonReader: {
            //    root: 'list',
            //    page: 'pageNumber',
            //    total: 'pageSize',
            //    records: 'totalCount',
            //    cell: "mylist"
            //},
            colModel: [
                { label: '主键', name: 'ID', hidden: true },
                { label: '地域', name: 'CustomDiYu', index: 'CustomDiYu', width: 100, align: 'left' },
                { label: '厂名', name: 'CustomName', index: 'CustomName', width: 200, align: 'left' },
                { label: '车间', name: 'CustomChejian', index: 'CustomChejian', width: 100, align: 'left' },
                { label: '省份', name: 'CustomProvience', index: 'CustomProvience', width: 100, align: 'left' },
                { label: '城市', name: 'CustomCity', index: 'CustomCity', width: 100, align: 'left' },
                { label: '区县', name: 'CustomArea', index: 'CustomArea', width: 100, align: 'left' },
                { label: '详细地址', name: 'CustomDetailAddress', index: 'CustomDetailAddress', width: 400, align: 'left' },
                //{ label: '联系人', name: 'CustomTel', index: 'CustomTel', width: 200, align: 'left' },
                //{ label: '职务', name: 'CustomTel', index: 'CustomTel', width: 100, align: 'left' },
                //{ label: '联系方式', name: 'CustomTel', index: 'CustomTel', width: 100, align: 'left' },
                {
                    label: '状态', name: 'CustomeState', index: 'CustomeState', width: 100, align: 'left',
                    formatter: function (cellvalue, options, rowObject) {
                        if (rowObject[8] == '0') {
                            return '离线';
                        }
                        else if (rowObject[8] == '1') {
                            return '在线';
                        }

                    }
                },
                { label: '安装开始时间', name: 'InstallDate', index: 'InstallDate', width: 100, align: 'left' },
                {
                    label: '安装进度', name: 'InstallState', index: 'InstallState', width: 100, align: 'left',
                    formatter: function (cellvalue, options, rowObject) {
                        if (rowObject[10] == '0') {
                            return '未安装';
                        }
                        else if (rowObject[10] == '1') {
                            return '正安装';
                        }
                        else if (rowObject[10] == '2') {
                            return '已安装';
                        }
                    }
                },
                { label: '投入使用', name: 'UseDate', index: 'UseDate', width: 100, align: 'left' }
            ],
            viewrecords: true,
            rowNum: 30,
            rowList: [30, 50, 100],
            pager: "#gridPager",
            sortname: 'ID',
            sortable: true,
            rownumbers: true,
            shrinkToFit: false,
            gridview: true,
            onSelectRow: function () {
                selectedRowIndex = $("#" + this.id).getGridParam('selrow');
            },
            gridComplete: function () {
                $("#" + this.id).setSelection(selectedRowIndex, false);
            }
        });


        //查询事件
        $("#btn_Search").click(function () {
            $gridTable.jqGrid('setGridParam', {
                postData: {
                    Action: "GetCustomerInfo",
                    keyword: $("#txt_Keyword").val()
                },
            }).trigger('reloadGrid');
        });

        //查询回车
        $('#txt_Keyword').bind('keypress', function (event) {
            if (event.keyCode == "13") {
                $('#btn_Search').trigger("click");
            }
        });


        //新增客户信息
        function btn_add(event) {
            dialogOpen({
                id: "Form",
                title: '新增客户信息',
                url: '../CustomerInfo/CustomAdd.html',
                width: "800px",
                height: "600px",
                callBack: function (iframeId) {
                    top.frames[iframeId].AcceptClick($('#gridTable'));
                }
            });
        }

        //编辑客户信息
        function btn_edit(event) {

            var keyValue = $("#gridTable").jqGridRowValue("ID");

            if (checkedRow(keyValue)) {
                dialogOpen({
                    id: "Form",
                    title: '编辑客户信息',
                    url: '../CustomerInfo/CustomEdit.html?CustomerID=' + keyValue,
                    width: "800px",
                    height: "600px",
                    callBack: function (iframeId) {
                        top.frames[iframeId].AcceptClick($('#gridTable'));
                    }
                });
            }

        }

        //删除客户信息
        function btn_delete(event) {

            var keyValue = $("#gridTable").jqGridRowValue("ID");
            if (keyValue) {
                dialogConfirm("注：您确定要删除吗？该操作将无法恢复", function (r) {
                    if (r) {
                        Loading(true, "正在删除数据...");

                        window.setTimeout(function () {
                            $.customerinfojs.deleteCustomerInfo(keyValue, $('#gridTable'));
                        }, 500);
                    }
                });
            }
        }

        //投入使用
        function btn_use(event) {
            var keyValue = $("#gridTable").jqGridRowValue("ID");
            var customername = $("#gridTable").jqGridRowValue("CustomName");
            if (checkedRow(keyValue)) {
                dialogOpen({
                    id: "Form",
                    title: '投入使用--' + customername,
                    url: '../CustomerInfo/CustomUseForm.html?&ID=' + keyValue + '&customername=' + customername,
                    width: "400px",
                    height: "200px",
                    callBack: function (iframeId) {
                        top.frames[iframeId].AcceptClick($('#gridTable'));
                    }
                });
            }
        }

        //所购设备
        function btn_search(event) {
            var keyValue = $("#gridTable").jqGridRowValue("ID");
            var customername = $("#gridTable").jqGridRowValue("CustomName");
            if (checkedRow(keyValue)) {
                dialogOpen({
                    id: "Form",
                    title: '所购设备--' + customername,
                    url: '../CustomerInfo/CustomEquInfo.html?&ID=' + keyValue + '&customername=' + customername,
                    width: "800px",
                    height: "500px",
                    btn: null
                });
            }
        }

    </script>
</body>
</html>
